<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@page import="dbpedia.QueryPedia"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.Iterator"%>
<%@page import="com.hp.hpl.jena.query.*"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>CO-TRANS Sample Page</title>
<script language="JavaScript" src="js/jquery.js"></script>
<script language="JavaScript" src="js/jquery.bgiframe.min.js"></script>
<script language="JavaScript" src="js/jquery.ajaxQueue.js"></script>
<script language="JavaScript" src="js/thickbox-compressed.js"></script>
<script language="JavaScript" src="js/jquery.autocomplete.js"></script>
<script language="JavaScript" src="js/localdata.js"></script>
<script language="JavaScript" src="js/functions.js"></script>

<link rel="stylesheet" href="css/jquery.autocomplete.css"
	type="text/css">
<link rel="stylesheet" href="css/thickbox.css" type="text/css">
<link rel="stylesheet" href="css/main.css" type="text/css">

<script type="text/javascript">
$(document).ready(function() {

	$("#suggest13").autocomplete(categories, {
		minChars: 0,
		width: 310,
		matchContains: "word",
		autoFill: false,
		multiple: true,
		formatItem: function(row, i, max) {
			return row.name;
		},
		formatMatch: function(row, i, max) {
			return row.name;
		},
		formatResult: function(row) {
			return row.name;
		}
	});
	
	$("#suggest13").result(function(event, data, formatted) {
		var hidden = $("#hidden");
		hidden.val( (hidden.val() ? hidden.val() + ";" : hidden.val()) + data.value);
	});
	
});

</script>

</head>

<body>
<h2>Enter Interests:</h2>

<form autocomplete="off">
		
		<p>
			<label>Categories:</label>
			<textarea id="suggest13" onchange="ClearHidden()"></textarea>
		</p>
		<p>
                    <input type="hidden" id="hidden">
		</p>
		<p>
		<input type="button" value="Search" onClick="Submit()">
		</p>
		
</form>

<br>
<div id="response"></div>
</body>
</html>